/**
 * Website common.css
 *
 * @author: Li Qiang
 */
html, body {
	height: 100%; 
	margin: 0; 
	padding: 0;
	background-color: black;
}
 
a:link, a:visited, a:hover, a:active {
	text-decoration: none; 
	color: #00f;
}

img {
	margin: 0;
	padding: 0;
	border:none;
} 

#wallpaper {
	position: fixed; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
}

#page-content {
	position: relative; 
	padding: 32px;
	clear: left; 
	margin-top: 0px;
	padding-top: 48px;
	z-index: 100; 
}

#topnav {
  position:fixed; 
  top: 0px;
  left: 0px;
  width: 100%;
  height: 48px;
  border: none;
  background-color: #c6d8ff;
  color: #000;
  z-index: 300; 
}

#optionmenu {
  position: fixed;
  bottom: 0px;
  left: 0px;
  height: 48px;
  border: none;
  color: #000;
  z-index: 300;
}

.optionmenu-item {
}

.optionmenu-open {
	color: #fff; 
	font-size: xx-large; 
	vertical-align: top;
}

.optionmenu-close {
	color: #fff; 
	font-size: xx-large; 
	vertical-align: top;
}

#header {
  position: fixed;
  top: 0px;
  color: #fff;
  width: 100%;
  text-align: center;
  padding-top: 4px;
  z-index: 200;
}

#footer {
  clear: both;
  position: fixed;
  bottom: 0px;
  color: #fff;
  width: 100%;
  text-align: center;
  padding-bottom: 4px;
  z-index: 200;
}

.top-left {
  position:fixed; 
  top: 0px;
  left: 0px;
}

.top-right {
  position: fixed;
  top: 0px;
  right: 0px;
}

.top-center {
  position: fixed;
  top: 0px;
  width: 100%;
  text-align: center;
}

.bottom-left {
  position: fixed;
  bottom: 0px;
  left: 0px;
}

.bottom-right {
  position: fixed;
  bottom: 0px;
  right: 0px;
}

.bottom-center {
  position: fixed;
  bottom: 0px;
  width: 100%;
  text-align: center;
}

.logo {
	display: block;
	font-family: monospace;
	font-size: 28px;
	font-weight: 900;
	text-decoration: none;
	height: 48px;
	width: 280px;
	margin: 0;
	padding: 0;
}

.logo img {
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: none;
	vertical-align: middle;
	background-color : transparent;
}

.logo span {
	height: 48px;
	margin: 0;
	padding: 0;
	color: #000;
}

.logo:hover {
	color: #000;
	background-color: orange;
	height: 48px;
}

.icon {
	margin: 0;
	padding: 0;
	border:none;
}

.icon16 {
	width: 16px;
	height: 16px;
	margin: 0;
	padding: 0;
	border:none;
}

.icon22 {
	width: 22px;
	height: 22px;
	margin: 0;
	padding: 0;
	border:none;
}

.icon32 {
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	border: none;
}

.icon48 {
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: none;
}

.ic48 {
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: none;
	background-color: #fff;
}


.thumb64 {
	width: 64px;
	height: 64px;
	margin: 0;
	padding: 0;
	border: none;
}

.thumb96 {
	width: 96px;
	height: 96px;
	margin: 0;
	padding: 0;
	border: none;
}

.thumb128 {
	width: 128px;
	height: 128px;
	margin: 0;
	padding: 0;
	border: none;
}

.thumb192 {
	width: 192px;
	height: 192px;
	margin: 0;
	padding: 0;
	border: none;
}

a:hover .icon, a:hover .icon16, a:hover .icon22, a:hover .icon32, a:hover .icon48 {
	text-decoration: none;
	background-color: orange;
}

.mimetype-icon-folder      { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 0px no-repeat; } 
.mimetype-icon-text        { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -36px no-repeat; } 
.mimetype-icon-html        { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -72px no-repeat; } 
.mimetype-icon-image       { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -108px no-repeat; } 
.mimetype-icon-audio       { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -144px no-repeat; } 
.mimetype-icon-application { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -180px no-repeat; } 
.mimetype-icon-video       { display:block; height: 22px; padding-left: 20px; background: transparent url(/image/mimetypes.png) 0 -216px no-repeat; } 

.action {
	font-size: 100%;
}

.action a:link, .action a:visited, .action a:active {
	text-decoration: none; 
	color: #00f;
}

.action a:hover {
	color: #000;
	background-color: orange;
}

.actionbar {
	background: #c6d8ff;
	height: 48px;
}

.separator {
	border-bottom: 1px solid rgb(119, 153, 221);
}
/**/